<template>
	<view class="page">
		<view class="flex benben-position-layout flex flex-wrap align-center wrongQuestion_flex_0"
			:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class='flex flex-wrap align-center justify-between flex-sub wrongQuestion_fd0_0'>
				<view class='flex flex-wrap align-center' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
					<text class='fu-iconfont2  wrongQuestion_fd0_0_c0_c0'>&#xE794;</text>
				</view>
				<text class='wrongQuestion_fd0_0_c1'>续租订单</text>
				<view class='wrongQuestion_fd0_0_c2'>
				</view>
			</view>
		</view>
		<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
		
		<view class="loading_css" v-if="isShow">
			<u-loading size="36" color="#1A66FA"></u-loading>
			<view>加载中</view>
		</view>
		<template v-else>
			<view class="order_status" >
				<view class="order_status_text" v-if="orderInfo.status == 1">待支付</view>
				<view class="order_status_text" v-if="orderInfo.status == 2 || orderInfo.status == 3">进行中</view>
				<view class="order_status_text" v-if="orderInfo.status == 4">已完成</view>
				<view class="order_status_text" v-if="orderInfo.status == 5">已取消</view>
				<view class="order_paytime flex align-center" v-if="orderInfo.status == 1">
					<text class="paytime_1">剩余支付时间</text>
					<u-count-down class="paytime_2" color="#1A66FA" separator-color="#1A66FA" :show-days="false" :show-hours="false" separator="zh" :timestamp="orderInfo.sysj" bg-color="transparent" @end="timeEnd"></u-count-down>
				</view>
			</view>
			
			<view class="car_info" :class="orderInfo.status == 1 ? 'marginTop1' : 'marginTop2'">
				<view class="vehicle_information">
					<view class="car_content">
						<view class="car_name">
							<view class="car_name_1">{{orderInfo.name}}</view>
							<view class="car_name_2">
								<text>{{orderInfo.seats}}座</text>
								<text class="car_name_2_1">丨</text>
								<text>{{orderInfo.gearbox}}</text>
								<text class="car_name_2_1">丨</text>
								<!-- <text>{{detailsInfo.category_name}}</text>
								<text class="car_name_2_1">丨</text> -->
								<text>{{orderInfo.model}}</text>
							</view>
						</view>
						<view class="car_img">
							<u-lazy-load height="120" border-radius="16" class="car_img" :image="orderInfo.image"></u-lazy-load>
							<image v-if="orderInfo.type == 2" class="car_icon" :src='STATIC_URL+"220.png"' mode="aspectFill"></image>
						</view>
					</view>
					<view class="license_plate">
						<view class="label_le">
							<!-- <template v-if="detailsInfo.tags">
								<template v-for="(v, k) in (detailsInfo.tags).split(',')">
									<image v-if="v == 1" class="label_1" :src='STATIC_URL+"219.png"' mode="aspectFill"></image>
									<view class="label_2" v-if="v != 1">{{getTag(v)}}</view>
								</template>
							</template> -->
						</view>
						<view class="plate_le">
							<image class="plate_le_1" :src='STATIC_URL+"269.png"'></image>
							<view class="plate_le_2">丨</view>
							<view class="plate_le_3">{{orderInfo.car_number}}</view>
						</view>
					</view>
				</view>
				<view class="car_date">
					<view class="date_content">
						<view class="date_item">
							<view class="date_item_1">{{timeData.toDay_month}}</view>
							<view class="date_item_2">
								<text v-if="timeData.is_today == 1">今天</text>
								<text v-else>{{timeData.week}}</text>
								<text>{{timeData.toDay_time}}</text>
							</view>
						</view>
						<view class="date_days">
							<view class="days_line"></view>
							<view class="days_num">
								<text v-if="timeData.dayNum > 0">{{timeData.dayNum}}天</text>
								<text v-if="timeData.dayHours > 0">{{timeData.dayHours}}小时</text>
							</view>
							<view class="days_line"></view>
						</view>
						<view class="date_item">
							<view class="date_item_1">{{timeData.twoDay_month}}</view>
							<view class="date_item_2">
								<text>{{timeData.twoWeek}}</text>
								<text>{{timeData.twoDay_time}}</text>
							</view>
						</view>
					</view>
					<view class="quotation_information">
						<view class="information">
							<view class="information_2">
								<image :src='STATIC_URL+"225.png"'></image>
								<view class="information_2_1">取还车</view>
								<view class="information_2_2">
									<view class="information_2_2_1" v-if="orderInfo.door_to_door == 1">到店取送车</view>
									<view class="information_2_2_1" v-else>店员上门取送车</view>
								</view>
							</view>
						</view>
						<view class="quotation_address">
							<!-- <image :src='STATIC_URL+"224.png"' mode="aspectFill"></image> -->
						</view>
					</view>
				</view>
			</view>
			
			
			<view class="preferential">
				<view class="tip_title flex align-center justify-between">
					<view>续租信息</view>
					<!-- <view class="tip_title_ri flex align-center">
						<template v-if="detailsInfo.is_auth != 1">
							<image class="tip_title_ri_1" :src='STATIC_URL+"270.png"' mode="aspectFill"></image>
							<text class="tip_title_ri_2">未认证</text>
						</template>
						
						<template v-if="detailsInfo.is_auth == 1">
							<image class="tip_title_ri_1" :src='STATIC_URL+"271.png"' mode="aspectFill"></image>
							<text class="tip_title_ri_2">已认证</text>
						</template>
						<image class="tip_title_ri_3" :src='STATIC_URL+"208.png"' mode="aspectFill"></image>
					</view> -->
				</view>
				<view class="coupon">
					<view class="coupon_le">
						续租截止时间
					</view>
					<view class="coupon_ri">
						{{timeData.twoDay}}
					</view>
				</view>
				<view class="coupon" style="margin-top: 24rpx;">
					<view class="coupon_le">
						续租时间
					</view>
					<view class="coupon_ri">
						<text v-if="timeData.dayNum > 0">{{timeData.dayNum}}天</text>
						<text v-if="timeData.dayHours > 0">{{timeData.dayHours}}小时</text>
					</view>
				</view>
			</view>
			<!-- <view class="deposit">
				<view class="tip_title">押金支付方式</view>
				<view class="deposit_text">
					<image :src='STATIC_URL+"235.png"'></image>
					<image :src='STATIC_URL+"272.png"'></image>
					<view class="explain">
						<view class="explain_text">
							<view class="explain_text_1">到店免押金</view>
							<view class="explain_text_2">在线支付租金取车时到店扫码免押或者通过其他方式</view>
							<view class="explain_text_1">到店支付</view>
							<view class="explain_text_2">租车押金已线下收款，收车验车后将进行退还</view>
						</view>
					</view>
				</view>
			</view> -->
			
			<view class="order_detail">
				<view class="tip_title">续租明细</view>
				<view class="order_item">
					<view class="order_item_le">基本租金</view>
					<view class="order_item_ri">
						<span>￥{{Number(total_rental)}}</span>
					</view>
				</view>
				<view class="order_item" v-if="rent_coupon_type == 3">
					<view class="order_item_le">续租立减·租金部分立省{{rent_reduce_rate}}%</view>
					<view class="order_item_ri order_item_ri_1">
						<text>￥-{{Number(rent_reduction_price)}}</text>
					</view>
				</view>
				<view class="order_item" v-if="detailsInfo.insurance_money > 0">
					<view class="order_item_le">{{insureItem.name}}</view>
					<view class="order_item_ri">
						<span>￥{{Number(detailsInfo.insurance_money)}}</span>
					</view>
				</view>
				<view class="order_item" v-if="detailsInfo.insure_plus_money > 0">
					<view class="order_item_le">{{upgrade_name}}</view>
					<view class="order_item_ri">
						<span>￥{{Number(detailsInfo.insure_plus_money)}}</span>
					</view>
				</view>
			</view>
			
			<view class="money_footer">
				<view class="footer_le">
					<view class="footer_le_1">
						<text>￥</text>
						<text class="footer_le_1_1">{{totalPrice > 0 ? totalPrice : 0}}</text>
						<text class="footer_le_1_2">￥{{Number(detailsInfo.total_price)}}</text>
					</view>
					
				</view>
				<view class="footer_ri">
					<view class="footer_ri_2" @click="postGenerateOrder">去支付</view>
				</view>
			</view>
		</template>
		<view style="height: 180rpx;"></view>

	</view>
</template>

<script>
	import utils from "@/common/utils/utils.js"
	export default {
		data() {
			return {
				"loadingImg": "",
				"errorImg": "",
				"imageUrl": "https://n.sinaimg.cn/spider20240423/618/w1267h951/20240423/00f3-b0424ba924fbe8bb330e2dabf0f7b880.jpg",
				scrollTop: 0, // 页面滚动距离
				buyShow: false,
				payType: [
					{
						name: '微信支付',
						icon: 'https://speed.zzjsxns.top/dyimages/264.png',
						id: 1
					},
					{
						name: '支付宝支付',
						icon: 'https://speed.zzjsxns.top/dyimages/265.png',
						id: 2
					},
					{
						name: '抖音支付',
						icon: 'https://speed.zzjsxns.top/dyimages/263.png',
						id: 3
					}
				],
				pay_id: 1,
				order_id: "",  // 订单id
				isShow: true,
				detailsInfo: {},
				orderInfo: {},
				noticeShow: false,
				detailShow: false,
				list2: [{
						name: '取消规则',
						id: ''
					},
					{
						name: '押金政策',
						id: ''
					}, {
						name: '取车证件',
						id: ''
					},
					{
						name: '里程限制',
						id: ''
					},
				],
				swiperIndex: 0,
				itemStyle: {
					'height': '78rpx',
					'fontSize': '26rpx',
					'color': '#666666'
				},
				activeStyle: {
					'color': '#111111',
					'fontWeight': 'bold'
				},
				upgrade_name: "",  // 升级保障服务名称
				is_submit: false,
				provider: "",
				cancelShow: false,
				timeData: {},
				days: 0,  // 选择的续租天数
				totalPrice: 0,
				storeInfo: {},
				cityInfo: {},
				tags: uni.getStorageSync('tag'),
				insureItem: "",
				total_rental: 0,
				calculate_rental_date_list: [],
				rent_coupon_type: 0,  // 折扣类型
				rent_reduce_rate: 0,  // 续租折扣比例
				rent_reduction_price: 0,  // 优惠金额
			}
		},
		components: {

		},
		onReady() {

		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		onLoad(options) {
			let { order_id, days, timeData } = options;
			if (order_id !== undefined) this.order_id = order_id;
			if (days !== undefined) this.days = days;
			if (timeData !== undefined) this.timeData = JSON.parse(timeData);
			this.getDetails();
			
			let _this = this;
			uni.getProvider({
				service: 'payment',
				success: res => {
					// console.log(res);
					_this.provider = res.provider[0];
				},
				fail: err => {
					console.log(err);
				}
			})
			// this.storeInfo = uni.getStorageSync('store');
			// this.cityInfo = uni.getStorageSync('city');
			// this.timeData = global.timeData;
			// console.log(this.timeData);
		},
		methods: {
			// 订单详情
			getDetails() {
				this.$api.post(global.apiUrls.postOrderDetail, {
					order_id: this.order_id
				}).then(result => {
					// console.log(res);
					if (result.data.code == 1) {
						this.orderInfo = result.data.data;
						this.$api.post(global.apiUrls.renewalMergeOrder, {
							order_id: this.order_id,
							start_time: this.timeData.toDay,
							end_time: this.timeData.twoDay,
							store_id: result.data.data.store_id,
							car_id: result.data.data.car_id,
							door_to_door: result.data.data.door_to_door,
							user_id: result.data.data.user_id,
							real_car_id: result.data.data.real_car_id,
							insure_plus_id: result.data.data.insure_plus_id,
							type: 1
						}).then(res => {
							this.isShow = false;
							// console.log(res);
							if (res.data.code == 1) {
								this.detailsInfo = res.data.data;
								this.total_rental = res.data.data.base_price;
								this.calculate_rental_date_list = res.data.data.calculate_rental_date_list;
								this.rent_coupon_type = res.data.data.rent_coupon_type;
								this.rent_reduce_rate = res.data.data.rent_reduce_rate;
								this.rent_reduction_price = res.data.data.rent_reduction_price;
								this.totalPrice = res.data.data.car_need_price;
								this.getCarInsure();
							} else {
								this.$message.info(res.data.info);
							}
						})
					} else {
						this.$message.info(result.data.info);
					}
				})
			},
			getTag(id) {
				let item = this.tags.find((item) => item.id == id);
				return item.name;
			},
			// 车辆保障数据列表  postEnhancedService
			getCarInsure() {
				this.$api.post(global.apiUrls.postEnhancedService, {
					car_id: this.detailsInfo.car_id,
					store_id: this.detailsInfo.store_id
				}).then(res => {
					// console.log(res);
					if (res.data.code == 1) {
						this.insureList = res.data.data;
						this.insureItem = "";
						if (res.data.data.length > 0) {
							res.data.data.forEach((v, k) => {
								if (v.service_type == 1) {
									this.insureItem = v;
								}
								if (v.id == this.orderInfo.insure_plus_id) {
									this.upgrade_name = v.name;
								}
							})
						}
					} else {
						this.$message.info(res.data.info);
					}
				})
			},
			// 生成订单   generateOrder
			postGenerateOrder() {
				if (this.is_submit) return;
				this.is_submit = true;
				this.$api.post(global.apiUrls.generateOrderTwo, {
					user_id: this.orderInfo.user_id,
					order_id: this.order_id,
					real_car_id: this.orderInfo.real_car_id,
					store_id: this.orderInfo.store_id,
					take_at: this.timeData.toDay,
					repay_at: this.timeData.twoDay,
					door_to_door: this.orderInfo.door_to_door,  //:1=自提,2=上门送车
					f_order_id: 1,  // 父级订单id
					is_free_deposit: 1,  // 是否免押金不能为空:1=不免押,2=免押
					type: 0,  // 订单类型:0=普通订单,1=优惠劵
					free_deposit_type: 1,  // 免押类型:1=到店免押,2=其他
					// lng: this.door_to_door == 1 ? this.storeInfo.lon : this.cityInfo.lon,
					// lat: this.door_to_door == 1 ? this.storeInfo.lat : this.cityInfo.lat,
					// address: this.door_to_door == 1 ? this.storeInfo.store_name : this.cityInfo.city
				}).then(res => {
					// console.log(res);
					if (res.data.code == 1) {
						// this.getPreOrder(res.data.data.order_id);
						// this.getPreOrder(3);
						this.$message.info(res.data.info);
						setTimeout(() => {
							uni.redirectTo({
								url: '/pages/order/payType?order_id=' + this.order_id + '&money=' + this.totalPrice
							})
						}, 800)
					} else {
						this.$message.info(res.data.info);
						this.is_submit = false;
						uni.hideLoading();
					}
				}).catch(err => {
					this.is_submit = false;
					uni.hideLoading();
				})
			},
			// 生成抖音预订单  postPreOrder
			getPreOrder(order_id) {
				this.$api.post(global.apiUrls.postPreOrder, {
					order_id: order_id
				}).then(res => {
					console.log(res);
					let orderInfo = res.data.data;
					if (res.data.code == 1) {
						uni.hideLoading();
						let _this = this;
						uni.requestPayment({
						    provider: _this.provider, 
						    orderInfo: orderInfo,
							service: 5,
							getOrderStatus(status) {
								console.log(status);
							},
						    success(res) {
								if (res.code == 0) {
									_this.$message.info('支付成功');
									setTimeout(() => {
										uni.navigateBack();
									}, 800)
								} else if (res.code == 4 || res.code == 3) {
									_this.$message.info('支付已取消');
									setTimeout(() => {
										uni.redirectTo({
											url: '/pages/my/myOrder/orderDetails?order_id=' + _this.order_id
										})
									}, 800)
								} else {
									_this.is_submit = false;
									_this.$message.info('支付失败,请稍后重试');
								}
								
								console.log(res);
							},
						    fail(e) {
								console.log(e);
								_this.is_submit = false;
								_this.$message.info('支付失败,请稍后重试');
							}
						})
					} else {
						this.$message.info(res.data.info);
						uni.hideLoading();
					}
				}).catch(err => {
					uni.hideLoading();
				})
			},
			// 待支付倒计时结束
			timeEnd() {
				this.isShow = true;
				this.getDetails();
			},
			// 拨打电话
			getPhone(phone) {
				if (!phone) {
					this.$message.info('未获取到门店联系方式，请联系客服');
					return;
				}
				uni.makePhoneCall({
					phoneNumber: phone //仅为示例
				});
			},
			
			// 取消订单  cancelOrder
			openCancel() {
				this.cancelShow = true;
			},
			confirmCancel() {
				this.$api.post(global.apiUrls.cancelOrder, {
					order_id: this.order_id
				}).then(res => {
					this.$message.info(res.data.info);
					if (res.data.code == 1) {
						this.isShow = true;
						this.getDetails();
					}
				})
			},
			// 续租
			goRenewal() {
				uni.navigateTo({
					url: '/pages/my/myOrder/renewaLease?order_id=' + this.order_id
				})
			},
			// 再次预定
			chooseCar() {
				uni.redirectTo({
					url: '/pages/index/modelsList/modelsList'
				})
			},
			click2(item) {
				this.swiperIndex = item.index;
			},
			openNotice(index) {
				this.swiperIndex = index;
				this.noticeShow = true;
			},
			selectPay(id) {
				this.pay_id = id;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.notice_info {
		.title_text {
			font-size: 32rpx;
			font-weight: bold;
			text-align: center;
			padding-top: 32rpx;
		}
		.notice_title {
			padding: 24rpx 0;
		}
	
		.notice_text {
			height: 300rpx;
			.notice_swiper {
				width: 100%;
				height: 100%;
				.swiper-item {
					width: 100%;
					height: 100%;
					padding: 0 32rpx 24rpx;
					font-size: 28rpx;
				}
			}
		}
	}
	.order_status {
		padding: 40rpx 24rpx;
		width: 100%;
		height: 260rpx;
		background: url(https://speed.zzjsxns.top/dyimages/226.png) no-repeat;
		background-size: 100% 100%;
		position: relative;
		.order_status_text {
			font-family: PingFang SC, PingFang SC;
			font-weight: 800;
			font-size: 44rpx;
			color: #222222;
		}
		.order_paytime {
			margin-top: 14rpx;
			.paytime_1 {
				font-weight: 500;
				font-size: 26rpx;
				color: #222222;
			}
			.paytime_2 {
				font-weight: 500;
				font-size: 30rpx;
				color: #EF2E28;
				margin-left: 12rpx;
			}
		}
	}
	.popup_price {
		background: #F6F7FB !important;
		padding-bottom: 32rpx;
		.popup_money {
			display: flex;
			align-items: center;
			justify-content: center;
			.money_1 {
				font-weight: bold;
				font-size: 40rpx;
				color: #000000;
			}
			.money_2 {
				font-weight: bold;
				font-size: 64rpx;
				color: #000000;
			}
		}
		.pay_list {
			background: #fff;
			padding: 8rpx 24rpx;
			border-radius: 16rpx;
			margin: 32rpx 32rpx 42rpx;
			.pay_item {
				padding: 24rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
				.pay_item_le {
					display: flex;
					align-items: center;
					image {
						width: 52rpx;
						height: 52rpx;
						margin-right: 20rpx;
					}
					text {
						font-weight: 500;
						font-size: 30rpx;
						color: #111111;
					}
				}
				.pay_item_ri {
					width: 32rpx;
					height: 32rpx;
				}
			}
		}
		.pay_btn {
			width: 692rpx;
			height: 96rpx;
			background: #FC5B03;
			border-radius: 80rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 30rpx;
			color: #FFFFFF;
			margin: 0 auto;
		}
	}

	.popup_title {
		font-weight: 500;
		font-size: 36rpx;
		color: #000000;
		padding: 32rpx 32rpx 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.popup_calendar {
		padding: 0 8rpx 12rpx;
	}

	.u_tabs {
		height: 78rpx;
		position: sticky;
		top: 0;
		z-index: 10;
		display: flex;
		background-color: #fff;

		.tab_item {
			flex: 1;
			background-color: #fff;

			// line-height: 100px;
			&.active {
				background-color: rgb(55, 185, 169);
			}
		}
	}
	.marginTop1 {
		margin-top: -80rpx;
	}
	.marginTop2 {
		margin-top: -120rpx;
	}
	.car_info {
		background: #fff;
		border-radius: 16rpx;
		margin-left: 24rpx;
		margin-right: 24rpx;
		padding: 20rpx;
		position: relative;
		z-index: 99;
	}
	.vehicle_information {
		position: relative;

		.car_content {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.car_name {
				.car_name_1 {
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					font-size: 30rpx;
					color: #111111;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				}

				.car_name_2 {
					margin-top: 16px;
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 26rpx;
					color: #111;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;

					.car_name_2_1 {
						color: #CCCCCC;
					}
				}
			}

			.car_img {
				width: 160rpx;
				height: 120rpx;
				position: relative;

				.car_icon {
					width: 80rpx;
					height: 18rpx;
					position: absolute;
					top: 8rpx;
					right: 8rpx;
				}
			}
			/deep/.u-lazy-item {
				width: 160rpx !important;
				height: 120rpx !important;
			}
		}

		.license_plate {
			display: flex;
			align-items: center;
			justify-content: space-between;
			background: #fff;
			padding: 16rpx 0;
			border-radius: 16rpx;
			// position: absolute;
			// width: 100%;
			// bottom: 0;

			.plate_le {
				display: flex;
				align-items: center;
				// width: 180rpx;
				height: 30rpx;

				.plate_le_1 {
					width: 28rpx;
					height: 28rpx;
				}

				.plate_le_2 {
					font-weight: 500;
					font-size: 22rpx;
					color: #506898;
				}

				.plate_le_3 {
					font-weight: 500;
					font-size: 22rpx;
					color: #506898;
				}
			}

			.label_le {
				flex: 1;
				display: flex;
				align-items: center;
			
				.label_1 {
					width: 108rpx;
					height: 30rpx;
				}
			
				.label_2 {
					padding: 2rpx 6rpx;
					background: rgba(26, 102, 250, 0.05);
					border-radius: 4rpx;
					font-weight: 500;
					font-size: 22rpx;
					color: #506898;
					margin-left: 12rpx;
				}
			}
		}
	}

	.car_date {
		padding: 24rpx 0 0;
		border-top: 2rpx solid #F7F7F7;

		.date_content {
			background: #F7F7F7;
			border-radius: 16rpx;
			padding: 20rpx 32rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			.date_item {
				.date_item_1 {
					font-size: 34rpx;
					font-weight: bold;
					color: #111111;
				}

				.date_item_2 {
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-size: 26rpx;
					color: #999;
				}
			}

			.date_days {
				display: flex;
				align-items: center;

				.days_line {
					width: 24rpx;
					height: 2rpx;
					background: #CCCCCC;
					border-radius: 2rpx;
				}

				.days_num {
					padding: 6rpx 34rpx;
					background: #FFFFFF;
					border-radius: 24rpx;
					border: 2rpx solid #CCCCCC;
					font-size: 26rpx;
					color: #111111;
				}
			}
		}

		.quotation_information {
			display: flex;
			justify-content: space-between;
			margin-top: 24rpx;

			.information {
				.information_2 {
					display: flex;
					margin-top: 16rpx;

					image {
						width: 18rpx;
						height: 12rpx;
						transform: translateY(12rpx);
					}

					.information_2_1 {
						font-weight: bold;
						font-size: 26rpx;
						color: #111111;
						margin: 0 12rpx 0 8rpx;
					}

					.information_2_2 {
						width: 434rpx;

						.information_2_2_1 {
							font-weight: bold;
							font-size: 26rpx;
							color: #1A66FA;
						}

						.information_2_2_2 {
							font-weight: 500;
							font-size: 26rpx;
							color: #111111;
							margin-top: 12rpx;
						}
					}
				}
			}

			.quotation_address {
				text-align: center;
				padding-top: 16rpx;

				image {
					width: 32rpx;
					height: 32rpx;
					margin-bottom: 8rpx;
				}

				.address_text {
					font-weight: 400;
					font-size: 20rpx;
					color: #1A66FA;
				}
			}

		}
	}


	.preferential {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 20rpx 24rpx 0;

		.coupon {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.coupon_le {
			font-weight: 400;
			font-size: 26rpx;
			color: #111111;
		}

		.coupon_ri {
			font-size: 26rpx;
			font-weight: bold;
			color: #111111;
		}
	}

	.order_detail {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx 1rpx;
		margin: 24rpx 24rpx 0;

		.order_item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 24rpx;

			.order_item_le {
				font-size: 26rpx;
				color: #111111;
				font-weight: 400;
			}

			.order_item_ri {
				font-weight: bold;
				font-size: 26rpx;
				color: #111111;	
			}
			.order_item_ri_1 {
				font-weight: bold;
				font-size: 26rpx;
				color: #FC5B03;
			}
		}

		.order_line {
			width: 100%;
			height: 2rpx;
			background: #E7E7E7;
		}

		.order_price {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			margin-top: 20rpx;

			.order_price_1 {
				font-weight: 400;
				font-size: 26rpx;
				color: #111111;
			}

			.order_price_2 {
				font-weight: bold;
				font-size: 30rpx;
				color: #EF2E28;
			}
		}
	}

	.deposit {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 24rpx 24rpx 0;

		.deposit_text {
			display: flex;

			image {
				width: 40rpx;
				height: 40rpx;
			}

			.explain {
				padding-left: 12rpx;
				display: flex;
				align-items: center;

				.explain_text {
					.explain_text_1 {
						font-weight: bold;
						font-size: 26rpx;
						color: #111111;
					}

					.explain_text_2 {
						margin-top: 12rpx;
						font-size: 22rpx;
						color: #666666;
						line-height: 26rpx;
					}
				}
			}
		}
	}
	.order_change {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 24rpx 24rpx 0;
		.change_item {
			width: 152rpx;
			height: 60rpx;
			border-radius: 8rpx;
			border: 2rpx solid #E7E7E7;
			font-weight: 400;
			font-size: 26rpx;
			color: #111111;
		}
	}
	.record_info {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 24rpx 24rpx 0;
		.record_item {
			padding: 12rpx 24rpx;
			image {
				width: 32rpx;
				height: 32rpx;
				margin-right: 8rpx;
			}
			font-weight: 500;
			font-size: 26rpx;
			color: #111111;
		}
		.record_line {
			width: 2rpx;
			height: 32rpx;
			background: #E7E7E7;
		}
	}
	.store_info {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 24rpx 24rpx 0;
		.store_content {
			.store_le {
				image {
					width: 64rpx;
					height: 64rpx;
					border-radius: 50%;
					margin-right: 16rpx;
				}
				.store_le_text {
					font-weight: bold;
					font-size: 26rpx;
					color: #111111;
				}
			}
			.store_ri {
				display: flex;
				align-items: center;
				.ri_item {
					display: flex;
					align-items: center;
					flex-direction: column;
					font-weight: 400;
					font-size: 20rpx;
					color: #CCCCCC;
					image {
						width: 32rpx;
						height: 32rpx;
						margin-bottom: 6rpx;
					}	
				}
				.ri_line {
					width: 2rpx;
					height: 32rpx;
					background: #E7E7E7;
					margin: 0 28rpx;
				}
			}
		}
	}
	.notice {
		background: #fff;
		border-radius: 16rpx;
		padding: 24rpx 20rpx;
		margin: 24rpx 24rpx 0;

		.notice_item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-top: 24rpx;

			.notice_item_le {
				font-weight: 400;
				font-size: 26rpx;
				color: #111111;
			}

			image {
				width: 32rpx;
				height: 32rpx;
			}
		}
	}

	.money_footer {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		position: fixed;
		bottom: calc(0rpx + var(--window-bottom));
		left: 0;
		background: #fff;
		z-index: 10;
		padding-right: 24rpx;
		padding-left: 30rpx;
		padding-top: 24rpx;
		padding-bottom: constant(safe-area-inset-bottom);
		/*兼容 IOS<11.2*/
		padding-bottom: env(safe-area-inset-bottom);

		.footer_le {
			.footer_le_1 {
				display: flex;
				align-items: center;
				font-weight: 500;
				font-size: 30rpx;
				color: #EF2E28;

				.footer_le_1_1 {
					font-weight: bold;
					font-size: 48rpx;
					color: #EF2E28;
				}
				.footer_le_1_2 {
					display: inline-block;
					font-size: 24rpx;
					color: #999999;
					text-decoration: line-through;
					margin-left: 12rpx;
				}
			}

			.footer_le_2 {
				font-weight: 500;
				font-size: 26rpx;
				color: #FC5B03;
			}
		}

		.footer_ri {
			display: flex;
			align-items: center;

			.footer_ri_1 {
				font-weight: 400;
				font-size: 26rpx;
				color: #1A66FA;
			}

			.footer_ri_2 {
				margin-left: 24rpx;
				width: 240rpx;
				height: 84rpx;
				background: #1A66FA;
				border-radius: 80rpx;
				font-weight: bold;
				font-size: 34rpx;
				color: #FFFFFF;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: PingFang SC, PingFang SC;
			}
		}
	}

	.tip_title {
		font-weight: bold;
		font-size: 30rpx;
		color: #111111;
		margin-bottom: 32rpx;
		.tip_title_ri {
			
			.tip_title_ri_1 {
				width: 40rpx;
				height: 39rpx;
			}
			.tip_title_ri_2 {
				font-weight: 400;
				font-size: 26rpx;
				color: #999999;
				margin-left: 4rpx;
			}
			.tip_title_ri_3 {
				width: 32rpx;
				height: 32rpx;
				margin-left: 8rpx;
			}
		}
	}

	.wrongQuestion_fd0_0 {
		padding: 0rpx 32rpx 0rpx 32rpx;
		height: 88rpx;
	}

	.wrongQuestion_fd0_0_c0_c0 {
		font-size: 32rpx;
		font-weight: 500;
		color: #111;
		line-height: 36rpx;
		width: 135rpx;
	}

	.wrongQuestion_fd0_0_c1 {
		font-size: 32rpx;
		font-weight: bold;
		color: #111;
		line-height: 50rpx;
	}

	.wrongQuestion_fd0_0_c2 {
		width: 135rpx;
		height: 45rpx;
		line-height: 45rpx;
		font-size: 32rpx;
		font-weight: 500;
		color: #333;
		text-align: right;
	}

	.wrongQuestion_flex_0 {
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 2000;
		top: 0rpx;
		background: #fff;
	}

	.page {
		min-height: calc(100vh - var(--window-bottom));
		background-size: 100% auto !important;
		background-color: #F6F7FB;
	}
</style>